<!DOCTYPE html>
<html lang="en">
<head>
    <#include "${request.getContextPath()}/commonPage.html" />
    <link rel="stylesheet" type="text/css" href="${request.getContextPath()}/css/sidemenu_style.css">
    <style>
        .north {
            height: 100px;
            /*background: -webkit-linear-gradient(left,#1e59e0,#3aabf7);*/
            background-color: #1e59e0; /* 浏览器不支持时显示 */
            background-image: linear-gradient(to top right, #133ad5, #3aabf7, #349cf2);
        }

        .west {
            width: 200px;
            background-color: #1e59e0; /* 浏览器不支持时显示 */
            background-image: linear-gradient(to bottom, #133ad5, #3aabf7);
        }

    </style>
</head>
<body class="easyui-layout">
<div data-options="region:'north',split:true,collapsible:false" class="north">
    <div style="position: absolute;bottom: 2px;right: 20px">
        <span style="color: white;font-size: 14px;">欢迎您</span>
    </div>
</div>
<div data-options="region:'west',split:true,collapsible:false" class="west">
    <div id="sm" class="easyui-sidemenu" data-options="data:data,border:false,multiple:true" style="width: 99%;"></div>
</div>
<div data-options="region:'center',border:false" style="padding:5px;">
    <!--    <iframe id="myframe" src="https://www.baidu.com" style="width: 100%;height: 100%;" frameborder="0">111</iframe>-->
    <div id="mytabs" class="easyui-tabs" data-options="plain:true,border:false,narrow:true,fit:true">
        <div title="首&nbsp;&nbsp;&nbsp;&nbsp;页" style="padding:20px;display:none;">
            <iframe src="" style="width: 100%;height: 100%;" frameborder="0">111</iframe>
        </div>
    </div>
</div>

<script>
    var data = [{
        text: '首页',
        iconCls: 'fa fa-wpforms'
    }, {
        text: '用户管理',
        iconCls: 'fa fa-at',
        state: 'open',
        children: [{
            text: '添加用户',
            attributes: {
                url: "/user/add"
            }
        }, {
            text: '管理用户',
            attributes: {
                url: "/user/main"
            }
        }]
    }, {
        text: '订单管理',
        iconCls: 'fa fa-table',
        state: 'open',
        children: [{
            text: '添加订单',
            attributes: {
                url: "/order/add"
            }
        }, {
            text: '订单管理',
            attributes: {
                url: "/order/main"
            }
        }, {
            text: '订单回收站',
            attributes: {
                url: "/order/recycler"
            }
        }]
    }, {
        text: '退出',
        iconCls: 'fa fa-table',
        state: 'open',
        children: [{
            text: '退出'
        }]
    }];
    $('#sm').sidemenu({
        onSelect: function (node) {
            //$('#myframe').attr("src",node.attributes.url);
            if ($("#mytabs").tabs("exists", node.text)) {
                $("#mytabs").tabs("select", node.text)
            } else {
                var aa = "<iframe src='" + node.attributes.url + "' style='width: 100%;height: 100%;' frameborder='0'></iframe>";
                $("#mytabs").tabs("add", {
                    title: node.text,
                    closable: true,
                    content: aa
                })
            }
        }
    })
</script>
</body>
</html>